<template>
  <page-wrap :title="dynamicTitle" :bgColor="dynamicColor" txtColor="#222" :showTop="showTop" :dark="true" back hideTab>
    <view class="resume u-skeleton" :style="'padding-top:' + navHeight + 'px;'">
      <view :class="['suggest-card', isTopDiffrent ? 'isTopDiffrent' : '']">
        <view class="suggest-card-top" @click="toResumeAssessment">
          <view class="suggest-icon">
            <view class="bot-image" />
          </view>
          <view :class="['suggest-info', resumeOpinion.score ? 'showup' : '']">
            <view class="suggest-info-title">
              简历诊断评分
              <view class="suggest-info-score">{{ currentScore }}</view> 分
              <u-icon name="arrow-right" color="#999" size="32" class="arrow-right"></u-icon>
            </view>
            <view :class="['suggest-info-subtitle', true]">
              {{ '2347' }}人完成优化问题后，提升了{{ '68%' }}的通过率
            </view>
          </view>
        </view>

        <view class="suggest-card-bottom">
          <view class="suggest-card-bottom-container">
            <view class="suggest-card-bottom-item">
              <view class="suggest-card-bottom-title">
                <text>
                  <text class="suggest-card-bottom-title-num">{{
                    currentOpinionNum + ' '
                  }}</text>
                  个待优化项
                </text>
              </view>
              <view class="suggest-card-bottom-button" @click="toResumeAssessment">
                去完善
              </view>
            </view>
            <view class="suggest-card-bottom-item" v-if="isTopDiffrent">
              <view class="suggest-card-bottom-title">
                <text>简历优化受阻，专业顾问在线解答 </text>
              </view>
              <view class="suggest-card-bottom-button" @click="handleTopConsultantEntranceClick">
                <img :src="consultant_entrance_hot_white" class="consultant_entrance_hot_white" />
                找顾问
              </view>
            </view>
          </view>
        </view>
      </view>
      <view :class="['jd-consultant', 'jd-sect']" :style="{ top: navHeight - 4 + 'px' }"
        @click="handleTopConsultantEntranceClick" v-if="isTopDiffrent && showATestFixedEntrance">
        <view class="jd-consultant-container">
          <view class="market-icon">
            <img :src="consultant_entrance_hot" alt="" />
          </view>
          <view class="market-main-text">优化简历</view>
          <view class="market-sub-text">心仪offer，入职涨薪</view>
        </view>
        <view class="market-button">找顾问</view>
      </view>
      <view class="top-card" @click="handleEdit('basic')">
        <view class="top-card-basic">
          <view class="left">
            <view class="info">
              <text class="name">{{ info.iname }}</text>
              <text class="edit"></text>
            </view>
            <view class="tag-list">
              <text class="tag-item" v-if="info.gznum">{{ Math.floor(info.gznum) }}年经验</text>
              <text class="divider" v-if="info.gznum">·</text>
              <text class="tag-item">{{ info.sex }}</text>
              <text class="divider" v-if="info.sex">·</text>
              <text class="tag-item">{{ info.Hka_p }}</text>
              <text class="divider" v-if="info.Hka_p">·</text>
              <text class="tag-item" v-if="rctypeList[info.rctypeId]">{{
                rctypeList[info.rctypeId]
              }}</text>
            </view>
            <!-- <view class="status">{{ handleStatus(info.resume_status) }}</view> -->
          </view>
          <view class="right">
            <view class="avatar-wrap">
              <image class="avatar" :src="info.pic"></image>
            </view>
          </view>
        </view>
        <view class="concat-bar">
          <view class="concat-bar-item">
            <text class="top-icon phone"></text>
            <text>{{ info.shouji || '未填写' }}</text>
          </view>
          <view class="concat-bar-item">
            <text class="top-icon email"></text>
            <text>{{ info.wechat || '未填写' }}</text>
          </view>
        </view>
      </view>
      <view class="fill">
        <view class="fill-item u-border-bottom">
          <view class="title-bar" @click="handleEdit('objective')">
            <view class="title-wrap">
              <text class="title">求职状态</text>
              <!-- <text class="required">必填</text> -->
            </view>
            <text class="edit-icon"></text>
          </view>
          <view v-if="status.type && status.type != 0" class="info">
            <view class="detail bold" @click="handleEdit('objective')">{{ handleStatus(status.type) }}
              <!-- {{status.time}} -->
            </view>
          </view>
          <view v-else class="info-empty">暂未设置求职状态</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar" @click="handleEdit('aim')">
            <view class="title-wrap">
              <text class="title">求职意向</text>
              <!-- <text class="required">必填</text> -->
            </view>
            <view class="add" v-if="allAimList.length < 3"><text class="add-icon"></text>
            </view>
          </view>
          <view class="info-list" v-if="allAimList && allAimList.length">
            <view class="info-item" v-for="(item, index) in allAimList" :key="index" @click="handleEdit('aim', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-enterprise"></text> -->
                  <view class="title">
                    <view class="title-content">{{ item.zwname }}</view>
                    <text class="subtitle">{{ item.min_salary }}元/月</text>
                  </view>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="detail">
                <view class="detail-desc">{{ item.cityName || '' }}
                  <text class="sub-desc">{{ tradeName || '' }} </text>
                </view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>未填写求职意向</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar" @click="handleEdit('exp')">
            <view class="title-wrap">
              <text class="title">工作经历</text>
              <!-- <text class="required">必填</text> -->
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.personWorkArr && info.personWorkArr.length">
            <view class="info-item" v-for="(item, index) in info.personWorkArr" :key="index"
              @click="handleEdit('exp', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-enterprise"></text> -->
                  <text class="title">{{ item.company }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.startdatev2 }} -
                {{ item.stopdatev2 >= today ? '至今' : item.stopdatev2 }}
                <view class="detail-title">{{ item.jtzw }}
                  <view class="isPractice" v-if="item.is_practice == 1">实习
                  </view>
                </view>
              </view>
              <view class="detail">
                <view class="detail-desc">{{
                  item.workdesc || '未填写描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>未填写工作经历</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar" @click="handleEdit('edu')">
            <view class="title-wrap">
              <text class="title">教育背景</text>
              <!-- <text class="required">必填</text> -->
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.personEdusArr && info.personEdusArr.length">
            <view class="info-item" v-for="(item, index) in info.personEdusArr" :key="index"
              @click="handleEdit('edu', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-school"></text> -->
                  <text class="title">{{ item.school }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.startdatev2 }} - {{ item.stopdatev2 }}
                <view class="detail-title">{{ eduList.find((ele) => +ele.value === +item.eduId).label }}
                  <text class="zye">{{ item.zye || '' }}</text>
                </view>
              </view>
              <view class="detail">
                <view class="detail-desc">{{ item.edus || '未填写描述' }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>未填写教育背景</view>
        </view>
        <view class="fill-item u-border-bottom" v-if="info.work_projectArr && info.work_projectArr.length">
          <view class="title-bar" @click="handleEdit('project')">
            <view class="title-wrap">
              <text class="title">项目经验</text>
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.work_projectArr && info.work_projectArr.length">
            <view class="info-item" v-for="(item, index) in info.work_projectArr" :key="index"
              @click="handleEdit('project', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-project"></text> -->
                  <text class="title">{{ item.person_projectName }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.person_projectstartdatev2 }} -
                {{ item.person_projectstopdatev2 }}</view>
              <view class="detail">
                <!-- <view class="detail-title">项目描述</view> -->
                <view class="detail-desc">{{
                  item.person_projectDesc || '未填写描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>未填写项目经验</view>
        </view>
        <view class="fill-item u-border-bottom" v-if="info.Grzz">
          <view class="title-bar" @click="handleEdit('eval')">
            <view class="title-wrap">
              <text class="title">自我评价</text>
              <!-- <text class="required">必填</text> -->
            </view>
            <text class="edit-icon"></text>
          </view>
          <view class="info" @click="handleEdit('eval')">
            <view class="detail" v-html="info.Grzz"></view>
          </view>
        </view>
        <view class="fill-item button-style u-border-bottom" v-if="info.personCerArr && info.personCerArr.length">
          <view class="title-bar" @click="handleEdit('cer')">
            <view class="title-wrap">
              <text class="title">个人证书</text>
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.personCerArr && info.personCerArr.length">
            <view class="info-item" v-for="(item, index) in info.personCerArr" :key="index"
              @click="handleEdit('cer', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-project"></text> -->
                  <text class="title">{{ item.CertName }}</text>
                  <!-- <text class="edit-icon"></text> -->
                </view>
              </view>
              <!-- <view class="time">{{ item.Years + "-" + item.Months }}</view> -->
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加个人证书</view>
        </view>
        <view class="fill-item u-border-bottom" v-if="info.otherTc">
          <view class="title-bar" @click="handleEdit('skill')">
            <view class="title-wrap">
              <text class="title">技能特长</text>
            </view>
            <text class="edit-icon"></text>
          </view>
          <view v-if="info.otherTc" class="info" @click="handleEdit('skill')">
            <view class="detail">{{ info.otherTc }}</view>
          </view>
          <view v-else class="info-empty">暂未添加技能特长</view>
        </view>
        <view class="fill-item u-border-bottom" v-if="info.trainArr && info.trainArr.length">
          <view class="title-bar" @click="handleEdit('train')">
            <view class="title-wrap">
              <text class="title">培训经历</text>
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.trainArr && info.trainArr.length">
            <view class="info-item" v-for="(item, index) in info.trainArr" :key="index"
              @click="handleEdit('train', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-skill"></text> -->
                  <text class="title">{{ item.train_institution }} |
                    {{ item.train_cource }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.train_startdatev2 }} - {{ item.train_enddatev2 }}</view>
              <view class="detail">
                <view class="detail-desc">{{
                  item.train_desc || '未填写描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>未填写培训经历</view>
        </view>
        <view class="fill-item u-border-bottom" v-if="info.studentLeaderArr && info.studentLeaderArr.length">
          <view class="title-bar" @click="handleEdit('schoolExp')">
            <view class="title-wrap">
              <text class="title">校园经历</text>
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.studentLeaderArr && info.studentLeaderArr.length">
            <view class="info-item" v-for="(item, index) in info.studentLeaderArr" :key="index"
              @click="handleEdit('schoolExp', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-skill"></text> -->
                  <text class="title">{{ item.person_studentLeaderjob }}
                    <!-- | 岗位名称空 -->
                  </text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.person_studentLeaderstartdatev2 }} -
                {{ item.person_studentLeaderstopdatev2 }}</view>
              <view class="detail">
                <view class="detail-desc">{{
                  item.person_studentLeaderjobdesc || '未填写描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加校园经历</view>
        </view>
        <view class="fill-item button-style u-border-bottom" v-if="info.awardArr && info.awardArr.length">
          <view class="title-bar" @click="handleEdit('reward')">
            <view class="title-wrap">
              <text class="title">奖项荣誉</text>
            </view>
            <view class="add"><text class="add-icon"></text></view>
          </view>
          <view class="info-list" v-if="info.awardArr && info.awardArr.length">
            <view class="info-item" v-for="(item, index) in info.awardArr" :key="index"
              @click="handleEdit('reward', item)">
              <view class="name-bar">
                <view class="name-wrap">
                  <!-- <text class="name-icon name-icon-skill"></text> -->
                  <text class="title">{{ item.person_awardesc }}</text>
                </view>
              </view>
              <!-- <view class="time">{{ item.person_awardate }}</view> -->
              <!-- <view class="detail">
                <view class="detail-desc">{{
                  item.person_studentLeaderjobdesc || "未填写描述"
                }}</view>
              </view> -->
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加奖项荣誉</view>
        </view>
      </view>
      <view class="extra" v-if="
          !info.Grzz ||
          !info.work_projectArr ||
          !info.work_projectArr.length ||
          !info.studentLeaderArr ||
          !info.studentLeaderArr.length ||
          !info.trainArr ||
          !info.trainArr.length ||
          !info.otherTc ||
          !info.awardArr ||
          !info.awardArr.length
        ">
        <view class="extra-title"> 自定义加分项 </view>
        <view class="extra-list">
          <view class="extra-list-item concern" @click="handleEdit('eval')" v-if="!info.Grzz">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">自我评价</text>
          </view>
          <view class="extra-list-item" @click="handleEdit('project')"
            v-if="!info.work_projectArr || !info.work_projectArr.length">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">项目经验</text>
          </view>

          <view class="extra-list-item" @click="handleEdit('schoolExp')"
            v-if="!info.studentLeaderArr || !info.studentLeaderArr.length">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">校园经历</text>
          </view>

          <view class="extra-list-item" @click="handleEdit('train')" v-if="!info.trainArr || !info.trainArr.length">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">培训经历</text>
          </view>
          <view class="extra-list-item" @click="handleEdit('skill')" v-if="!info.otherTc">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">技能特长</text>
          </view>
          <view class="extra-list-item" @click="handleEdit('reward')" v-if="!info.awardArr || !info.awardArr.length">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">奖项荣誉</text>
          </view>
          <!-- <view class="extra-list-item" @click="handleEdit('aim')">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">求职意向</text>
          </view>
          <view class="extra-list-item" @click="handleEdit('exp')">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">工作经历</text>
          </view>
          <view class="extra-list-item" @click="handleEdit('edu')">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">教育背景</text>
          </view> -->
          <view class="extra-list-item" @click="handleEdit('cer')"
            v-if="!info.personCerArr || !info.personCerArr.length">
            <text class="extra-icon"><text class="add-icon"></text></text>
            <text class="extra-text">个人证书</text>
          </view>
        </view>
      </view>
      <view class="update" v-if="info.updatetime">简历最新更新时间：{{ info.updatetime }}</view>

      <view class="produce-btns diffirentBottom" v-if="isBottomDiffrent">
        <view class="real-btns" v-if="isBottomDiffrentOpen">
          <view class="produce-btn-item" @click="produceResumeAttachment">
            <text class="k-icon k-icon-annex"></text>
            <text>生成简历附件</text>
          </view>
          <view class="produce-btn-item" @click="toEnclosure">
            <text class="k-icon k-icon-attach"></text>
            <text>简历导入</text>
          </view>
          <view class="produce-btn-item" @click="handleReflesh">
            <text class="k-icon k-icon-refresh"></text>
            <text>刷新简历</text>
          </view>
          <view class="produce-btn-item" @click="toPreview">
            <text class="k-icon k-icon-preview"></text>
            <text>预览简历</text>
          </view>
        </view>
        <view class="consultant-buy-entrance fade-enter-active" v-else @click="handleBottomConsultantEntranceClick">
          <img :src="consultant_entrance_hot_change" alt="" /> 找顾问优化简历
        </view>
        <view class="toggleBtn" @click="handleBottomToggle">
          <img :src="newResumeBottonToggle" class="newResumeBottonToggle" />
        </view>
      </view>
      <view class="produce-btns" v-else>
        <view class="produce-btn-item" @click="produceResumeAttachment">
          <text class="k-icon k-icon-annex"></text>
          <text>生成简历附件</text>
        </view>
        <view class="produce-btn-item" @click="toEnclosure">
          <text class="k-icon k-icon-attach"></text>
          <text>简历导入</text>
        </view>
        <view class="produce-btn-item" @click="handleReflesh">
          <text class="k-icon k-icon-refresh"></text>
          <text>刷新简历</text>
        </view>
        <view class="produce-btn-item" @click="toPreview">
          <text class="k-icon k-icon-preview"></text>
          <text>预览简历</text>
        </view>
      </view>
    </view>
    <!-- 预加载所有图片，防止序列帧闪动 -->
    <!-- <view class="preloadImages" style="display: none;">
      <image :src="`http://img3.job1001.com/ypMp/elan/images/resume/normalBotFrames/${n+1}_lq.png`" v-for="n in 19"
        :key="n+100" />
    </view> -->
    <LoginDialog ref="loginDialog" @loginSuccessBack="loginSuccessBack"></LoginDialog>
  </page-wrap>
</template>

<script>
import { eduList, aimList } from "@/utils/data";
import {
  getPersonDetail,
  refreshResume,
  getResumeIntegrity,
  getMyIntendedTradeList,
} from "@/api/index";
import {
  getResumeData,
  getResumeOpinion,
  getProductGroup,
  addBuryingPoint,
  cardRegist,
  getUserInfo,
} from "@/api/modules/career";
import { env } from "@/api/root";
import ShareMixin from "@/mixins/share";
import { formatTime } from "@/utils/handle";
import LoginDialog from "@/components/LoginDialog";

export default {
  name: "newResume",
  mixins: [ShareMixin],
  components: {
    LoginDialog,
  },
  data() {
    return {
      productSign: "",
      isIOS: uni.getSystemInfoSync().platform == "ios",
      showATestFixedEntrance: false,
      isTopDiffrent: false,
      isBottomDiffrentOpen: true, //为true的时候显示简历按钮 false的时候为顾问营销按钮
      isBottomDiffrent: false,
      resumeOpinitonLoading: true,
      resumeOpinion: {
        opinionLevel: "优秀",
        opinionNum: 6,
        opinionOverRate: "95%",
        opinionPassRate: "68%",
        opinionPersonNum: 2347,
      },
      startScore: 0,
      currentScore: 0,
      currentOpinionNum: 0,
      interval: null,
      dynamicColor: "transparent",
      navHeight: getApp().globalData.navHeight,
      dynamicTitle: "我的在线简历",
      today: "",
      cnt: 0,
      eduList,
      aimList,
      allAimList: [], //求职意向列表（职位啥的
      rctypeList: {
        1: "社会人才",
        0: "学生",
      },
      info: {},
      status: {}, //求职状态什么的
      showTop: false,
      complete: 0,
      personId: uni.getStorageSync("person-id").slice(2) || undefined,
      routeList: {
        basic: "/pagesSub/newResume/basic/index",
        exp: "/pagesSub/newResume/experience/index",
        edu: "/pagesSub/newResume/education/index",
        project: "/pagesSub/newResume/project/index",
        eval: "/pagesSub/newResume/generalTextAreaPage/index", //textArea的页面尽量都用这个通用页面
        skill: "/pagesSub/newResume/generalTextAreaPage/index",
        train: "/pagesSub/newResume/train/index",
        cer: "/pagesSub/newResume/certificate/index",
        schoolExp: "/pagesSub/newResume/schoolExp/index",
        reward: "/pagesSub/newResume/reward/index",
        objective: "/pagesSub/newResume/objective/index",
        aim: "/pagesSub/newResume/aimItem/index",
      },
      topBg: `url(${this.$imgBaseSelf}home/top_bg.png)`,
      sharePath: "/pagesSub/newResume/index",
      shareTitle: "求职利器，快速生成你的专属简历",
      newResumeBottonToggle: "",
      newResumeBottonToggleOpen:
        this.$imgBaseSelf + "resume/newResumeBottonToggle.svg",
      newResumeBottonToggleClose:
        this.$imgBaseSelf + "resume/newResumeBottonToggleClose.svg",
      consultant_entrance_hot_change:
        this.$imgBaseSelf + "careerPath/consultant_entrance_hot_change.png",
      consultant_entrance_hot_white:
        this.$imgBaseSelf + "careerPath/consultant_entrance_hot_white.svg",
      consultant_entrance_hot:
        this.$imgBaseSelf + "careerPath/consultant_entrance_hot.png",
      imageUrl: this.$imgBaseSelf + "resume/newResumeShareImage_new.jpg", //分享图,要在初始化完毕之后再赋值一次，而且必须写https
    };
  },
  watch: {
    info: {
      handler(val) {
        if (val.Iname_p !== undefined) {
          let cnt = 0;
          if (!val.personEdusArr || !val.personEdusArr.length) cnt++;
          if (
            (!val.personWorkArr || !val.personWorkArr.length) &&
            !+val.rctypeId
          )
            cnt++;
          let keys = [
            "iname",
            "sex",
            "bday",
            "regionid",
            "hka",
            "rctypeId",
            "start_workdate",
            "shouji",
            "email",
          ];
          let basicNotComp = false;
          keys.forEach((ele) => {
            if (ele === "start_workdate") {
              basicNotComp = +val.rctypeId && !val[ele];
            } else if (!val[ele]) {
              basicNotComp = true;
            }
          });
          if (basicNotComp) cnt++;
          this.cnt = cnt;
          getApp().globalData.resumeInfo = val;
        }
      },
      deep: true,
    },
  },
  onPageScroll(e) {
    //滚动改变颜色
    this.showTop = e.scrollTop >= 10;
    this.showATestFixedEntrance = e.scrollTop >= 150;
    // console.log('showATestFixedEntrance', this.showATestFixedEntrance);

    if (this.showTop) {
      this.dynamicTitle = this.positionName;
      this.dynamicColor = "#ffffff";
    } else {
      this.dynamicTitle = "我的在线简历";
      this.dynamicColor = "transparent";
    }
  },
  onShow() {
    this.today = formatTime(new Date(), "yyyy-MM-dd");
    if (!this.personId) {
      this.showLoginDialog();
      return;
    }
    let tabBarList =
      getApp().globalData.loginStatus === "company"
        ? getApp().globalData.companyTabs
        : getApp().globalData.personTabs;
    getApp().globalData.tabBarList = tabBarList;
    this.getResumeData();
    this.getPersonDetail();
    this.getResumeIntegrity();
    this.getMyIntendedTradeList();
    this.getResumeOpinion();
    this.getProductGroupFn();
    this.newResumeBottonToggle = this.newResumeBottonToggleClose;
  },
  mounted() {
    // this.sharePath =
    //   "/pagesSub/newResume/index?personId=" + this.personId;
    // this.shareQuery = "personId=" + this.personId;
    this.personId && this.handleABExp();
    this.personId &&
      setTimeout(() => {
        this.handleBottomToggle();
      }, 7000);

    this.imageUrl =
      "https://img3.job1001.com/ypMp/elan/images/resume/newResumeShareImage_new.jpg";
  },
  methods: {
    async cardRegistFn() {
      const params = {
        personId: this.personId,
      };
      if (env == "test") {
        params.cardType = 54;
      } else if (env == "pro") {
        params.cardType = 28;
      }
      const res = await cardRegist(params);
      return res;
    },
    async getUserInfoFn() {
      uni.showLoading({ title: "" });
      // 这个uid一定要传，因为在interceptors中，没有传参的请求的请求头不会带上uid，而这个请求一定要uid
      const res = await getUserInfo({ uid: "" });
      if (res.code == 200) {
        //如果没有cardType就绑定一个q2c端的
        if (res.data && !res.data.cardType) {
          const registerRes = await this.cardRegistFn();
          uni.hideLoading();
          if (registerRes.code !== 200) {
            uni.showToast({
              title: registerRes.status_desc,
              icon: "none",
            });
          } else if (registerRes.code == 200) {
            const infoRes = await getUserInfo({ uid: "" });
            if (infoRes.code == 200) {
              uni.setStorageSync("personName", infoRes.data.personName);
              uni.setStorageSync("cardType", infoRes.data.cardType);
            }
          }
        } else {
          uni.setStorageSync("personName", res.data.personName);
          uni.setStorageSync("cardType", res.data.cardType);
        }
      }
    },
    //普通的埋点
    async addBuryingPointFn(etId) {
      if (!this.personId) return;
      const params = {
        etId: etId,
        personId: uni.getStorageSync("person-id").slice(2) || "",
        cardType: this.cardType
          ? this.cardType
          : uni.getStorageSync("cardType") || this.cardType,
        consultantId: uni.getStorageSync("sellId")
          ? uni.getStorageSync("sellId")
          : "",
        // statType: this.statType ? this.statType : null,
        originType: this.originFrom == "shareLink" ? 10 : 20,
      };
      const res = await addBuryingPoint(params);
    },
    async getProductGroupFn() {
      const params = {
        personId: uni.getStorageSync("person-id").slice(2) || undefined,
        id: "1",
        unlockTypeList: [10, 20, 30, 40], // 这里的参数后期可能会改，这里比较复杂因为是公共页面
      };
      const res = await getProductGroup(params);
      if (res.code == 200 && Array.isArray(res.data)) {
        if (res.data.length != 0) {
          this.productSign = res.data[0].productSign;
        }
      }
    },
    toPreview() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      this.addBuryingPointFn(20015);
      uni.navigateTo({
        url: "/pagesSub/resume/preview/index",
      });
    },
    toEnclosure() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      this.addBuryingPointFn(20013);
      uni.navigateTo({
        url: "/pagesSub/userCenter/enclosure/index",
      });
    },
    loginSuccessBack() {
      this.personId = uni.getStorageSync("person-id").slice(2) || undefined;
      this.getUserInfoFn();
      this.getResumeData();
      this.getPersonDetail();
      this.getResumeIntegrity();
      this.getMyIntendedTradeList();
      this.getResumeOpinion();
      this.getProductGroupFn();
      this.handleABExp();
      setTimeout(() => {
        this.handleBottomToggle();
      }, 7000);
    },
    showLoginDialog() {
      this.$refs.loginDialog.setVisibility(true);
    },
    handleTopConsultantEntranceClick() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      //简历页面A测点击入口（顶部）
      wx.reportEvent("resume_top_consultant_entrance", {});
      switch (this.productSign) {
        case "ZHITU_WUHAN_SERVICE":
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/WuHanBuyPage",
          });
          break;
        case "ZHITU_TOC_SERVICE":
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/CBuyPage",
          });
          break;
        default:
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/CBuyPage",
          });
          break;
      }
    },
    handleBottomConsultantEntranceClick() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      this.addBuryingPointFn(20030);
      //简历页面B测点击入口（底部）
      wx.reportEvent("resume_bottom_consultant_entrance", {});
      switch (this.productSign) {
        case "ZHITU_WUHAN_SERVICE":
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/WuHanBuyPage",
          });
          break;
        case "ZHITU_TOC_SERVICE":
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/CBuyPage?etId=20030",
          });
          break;
        default:
          uni.navigateTo({
            url: "/pagesSub/userCenter/careerPathV2/components/CBuyPage?etId=20030",
          });
          break;
      }
    },
    handleBottomToggle() {
      this.isBottomDiffrentOpen = !this.isBottomDiffrentOpen;
      if (this.isBottomDiffrentOpen) {
        this.newResumeBottonToggle = this.newResumeBottonToggleOpen;
        this.addBuryingPointFn(20017);
      } else {
        this.newResumeBottonToggle = this.newResumeBottonToggleClose;
        this.addBuryingPointFn(20016);
      }
    },
    handleABExp() {
      const res = wx.getExptInfoSync(["expt_1711934449"]);
      if (res.expt_1711934449 === undefined) {
        /* 返回空对象；未命中实验、实验待发布（白名单除外）或者实验结束后会命中该分支 */
        /* 业务逻辑，可对齐线上 */
      } else if (res.expt_1711934449 == "0") {
        this.isTopDiffrent = true;
        console.log("对照组！");

        /* 对照组业务逻辑 */
      } else if (res.expt_1711934449 == "1") {
        this.isBottomDiffrent = true;
        console.log("底部差分");
        /* 底部差分业务逻辑 */
      } else {
        /* 异常分支逻辑 */
      }
    },
    animateScore() {
      if (this.interval) return;
      const targetScore = this.resumeOpinion.score;
      const targetPersonNum = this.resumeOpinion.opinionNum;
      let currentTime = 0;
      const totalTime = 2000; // Total animation time in milliseconds
      const accelerationFactor = 2; // Adjust the acceleration factor to control the animation speed

      this.interval = setInterval(() => {
        currentTime += 20; // Interval time
        const progress = currentTime / totalTime;
        this.currentScore = Math.round(
          this.easeOutQuadratic(progress) * (targetScore - this.startScore) +
            this.startScore
        );
        this.currentOpinionNum = Math.round(
          this.easeOutQuadratic(progress) * targetPersonNum
        );

        if (currentTime >= totalTime) {
          clearInterval(this.interval);
          this.interval = null;
        }
      }, 20);
    },
    easeOutQuadratic(t) {
      return -1 * t * (t - 2);
    },
    // 获取用户简历评分
    getResumeOpinion() {
      const params = {
        personId: this.personId,
      };
      setTimeout(() => {
        getResumeOpinion(params)
          .then((res) => {
            if (res.code == 200) {
              this.resumeOpinion = res.data;
              this.resumeOpinitonLoading = false;
              this.startScore = Math.max(this.resumeOpinion.score - 20, 0); // Starting score
              this.animateScore();
            }
          })
          .catch((e) => {
            console.log(e);
          });
      }, 1500);
    },
    async toResumeAssessment() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      this.addBuryingPointFn(20010);
      uni.navigateTo({
        url: `/pagesSub/newResume/resumeAssessment/index?target=AIResumeDiagnoseNew`,
      });
    },
    handleEdit(key, item) {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      let route = this.routeList[key];

      if (item) {
        if (key == "project") {
          route += `?id=${item.person_projectId}`;
        } else if (key == "edu") {
          route += `?id=${item.edusId}`;
          debugger;
        } else if (key == "exp") {
          route += `?id=${item.workId}`;
        } else if (key == "train") {
          route += `?id=${item.train_id}`;
        } else if (key == "cer") {
          route += `?id=${item.id}`;
        } else if (key == "schoolExp") {
          route += `?id=${item.person_studengLeaderId}`;
        } else if (key == "reward") {
          route += `?id=${item.person_awardId}`;
        } else if (key == "aim") {
          route += `?intended_id=${item.intended_id}`;
        }
      }
      //一些原本直接跳textArea的地方要带id进去通用页面用接口直接修改
      if (key == "eval") {
        route += `?type=eval`;
      }
      if (key == "skill") {
        route += `?type=skill`;
      }
      this.addBuryingPointFn(20022);
      uni.navigateTo({
        url: route,
      });
    },
    getMyIntendedTradeList() {
      let param = {
        person_id: this.personId,
      };
      getMyIntendedTradeList(param).then((res) => {
        if (+res.code === 200) {
          this.status = {
            type: +res.data.personInfo.person_status,
            time: res.data.personInfo.workdate,
          };
          //刷新求职状态里保存的字段值
          getApp().globalData.resumeInfo.person_status =
            +res.data.personInfo.person_status;
          getApp().globalData.resumeInfo.workdate =
            res.data.personInfo.workdate;
          this.allAimList = res.data.myTended || [];
        }
      });
    },
    produceResumeAttachment() {
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      // if (+this.complete < 50) {
      //   uni.showToast({ icon: "none", title: "请先将在线简历填写完整" });
      //   return;
      // }
      // if (!this.status.type || this.status.type == 0) {
      //   uni.showToast({ icon: "none", title: "请先将求职状态填写完整" });
      //   return;
      // }
      // if (
      //   this.info.rctypeId_p != "应届毕业生" &&
      //   (!this.info.personWorkArr || this.info.personWorkArr.length == 0)
      // ) {
      //   uni.showToast({ icon: "none", title: "请先将工作经历填写完整" });
      //   return;
      // }
      // if (!this.info.personEdusArr || this.info.personEdusArr.length == 0) {
      //   uni.showToast({ icon: "none", title: "请先将教育背景填写完整" });
      //   return;
      // }
      // if (
      //   !this.info.person_job_array ||
      //   this.info.person_job_array.length == 0
      // ) {
      //   uni.showToast({ icon: "none", title: "请先完善求职意向" });
      //   return;
      // }
      this.addBuryingPointFn(20012);
      uni.navigateTo({ url: `/pagesSub/newResume/resumeTemplate/index` });
    },
    handleStatus(val) {
      let status = aimList.find((ele) => +ele.value === +val);
      return status ? status.label : "未设置";
    },
    getResumeData() {
      console.log("在首页刷新了！");

      let param = {
        personId: this.personId,
        conditionArr: JSON.stringify({
          is_mp: 1,
        }),
      };
      getResumeData(param).then((res) => {
        let data = res.data || res;
        // console.log("getResumeData", data);
        this.info = { ...this.info, ...data };
        getApp().globalData.userInfo = this.info;
        // console.log("this.info", this.info);
      });
    },
    getResumeIntegrity() {
      let params = {
        personid: this.personId,
        conditionArr: "",
      };
      getResumeIntegrity(params).then((res) => {
        this.complete = res.info.resumeIntegrity;
      });
    },
    getPersonDetail(update) {
      if (
        !getApp().globalData.userInfo ||
        !getApp().globalData.userInfo.id ||
        update
      ) {
        let param = {
          param: JSON.stringify({
            personId: this.personId,
          }),
          where: "",
          slaveInfo: 1,
        };
        getPersonDetail(param).then((res) => {
          let data = res.data || res;
          if (
            data.pic &&
            data.pic.indexOf("img.job1001.com/myUpload/pic.gif") >= 0
          ) {
            data.pic = this.$defalutAvatar;
          }
          this.info = { ...this.info, ...data };
          getApp().globalData.userInfo = this.info;
        });
      } else {
        this.info = { ...this.info, ...getApp().globalData.userInfo };
        getApp().globalData.userInfo = this.info;
      }
    },
    handleReflesh() {
      let param = {
        person_id: this.personId,
      };
      refreshResume(param).then((res) => {
        if (res && +res.code === 200) {
          uni.showToast({ icon: "none", title: "刷新成功" });
          this.getResumeData();
          this.getPersonDetail();
          this.getResumeIntegrity();
          this.addBuryingPointFn(20014);
        }
      });
    },
  },
};
</script>

<style lang="scss">
$img-base-resume: $img-base + "resume/";
$img-base: $img-base;
@include img-base-self(".k-icon-annex", "resume/annex_new.svg?v=1");
@include img-base-self(".k-icon-attach", "resume/attach.svg?v=2");
@include img-base-self(".k-icon-refresh", "resume/refresh_new.svg?v=3");
@include img-base-self(".k-icon-preview", "resume/preview_new.svg?v=4");
@include img-base-self(".resume", "resume/newResumeBG.png");

@font-face {
  font-family: "D-DIN-PRO-500-Medium";
  /*定义字体名称*/
  src: url("https://img3.job1001.com/ypMp/elan/fontFamily/careerPath/D-DIN-PRO-500-Medium.otf");
}

@keyframes diffirentTopAnimation {
  0% {
    top: 0rpx;
  }

  45% {
    top: 0rpx;
  }

  60% {
    top: -71rpx;
  }

  100% {
    top: -71rpx;
  }
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.resume {
  background-color: #fdfeff;
  color: $uni-text-color-333;
  position: relative;
  padding-bottom: calc(42rpx + constant(safe-area-inset-bottom));
  padding-bottom: calc(42rpx + env(safe-area-inset-bottom));
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position-y: -2rpx;

  // padding: 0 32rpx;
  .white {
    background-color: $uni-bg-color;
    padding: 32rpx;
  }

  .top-icon {
    display: inline-block;
    margin-right: 6rpx;
    width: 28rpx;
    height: 28rpx;
    background-size: 100% 100%;
    vertical-align: middle;

    &.phone {
      background-image: url($img-base-resume + "phone_new.png");
    }

    &.email {
      background-image: url($img-base-resume + "mail_new.png");
    }
  }

  .resume-tips {
    margin: 32rpx;
    padding: 16rpx 0;
    background: #fff3e1;
    color: #f86e21;
    border-radius: 16rpx;
    font-size: $uni-font-size-base;
    text-align: center;
  }

  .suggest-card {
    width: calc(100vw - 64rpx);
    box-sizing: border-box;
    margin: 22rpx 32rpx 0;
    box-shadow: 0rpx 4rpx 34rpx 4rpx rgba(51, 110, 214, 0.08);
    border-radius: 12rpx;
    border: 2rpx solid #ccecee;
    transition: color 1s ease, background-color 1s ease;

    &-top {
      display: flex;
      align-items: center;
      padding: 24rpx 0 20rpx 24rpx;
      border-radius: 12rpx 12rpx 0 0;
      background: linear-gradient(103deg, #eff9fa 0%, #eef5fd 30%, #fff 100%);

      .suggest-icon {
        width: 82rpx;
        height: 82rpx;
        margin-right: 26rpx;

        .bot-image {
          position: relative;
          top: 9rpx;
          width: 82rpx;
          height: 82rpx;
          background-image: url($img-base-resume + "/newResumeBotFramesSprites_new3.png");
          /* 雪碧图路径 */
          // background-size: 82rpx 82rpx;
          background-position: -10px -10px;
          background-size: 1220px auto; //图的长度
          background-repeat: no-repeat;
          animation: newResumeBotFramesSprites 13s steps(19) forwards infinite; //steps是总图数-1 infinite;
          transform: scale(1.03);
        }

        @keyframes newResumeBotFramesSprites {
          0% {
            background-position: -10px -10px;
          }

          12% {
            background-position: -1169px -10px; //第一个参数是网页里的最后一个数字 https://www.toptal.com/developers/css/sprite-generator
          }

          86% {
            background-position: -1169px -10px; //保持静止
          }

          100% {
            background-position: -10px -10px;
          }
        }
      }

      .suggest-info {
        margin-top: -4rpx;

        &-title {
          display: flex;
          align-items: flex-end;
          font-size: 32rpx;
          font-weight: bold;
          color: #000;
          margin-bottom: 18rpx;
          height: 56rpx;

          .arrow-right {
            position: relative;
            top: -6rpx;
            margin-left: 12rpx;
          }

          .suggest-info-score {
            display: inline-flex;
            align-items: flex-end;
            font-family: "D-DIN-PRO-500-Medium";
            font-size: 48rpx;
            font-weight: bold;
            color: #f75a3e;
            margin: 0 12rpx;
            // margin-bottom: -6rpx;
          }
        }

        &-subtitle {
          font-size: 24rpx;
          color: #333333;
          margin-bottom: 16rpx;

          &:last-of-type {
            margin-bottom: 0;
          }
        }
      }
    }

    &.isTopDiffrent {
      .suggest-card-bottom-container {
        animation: diffirentTopAnimation 10s alternate-reverse infinite;
      }

      .suggest-card-bottom-item:last-of-type {
        .suggest-card-bottom-button {
          padding-left: 8rpx;
          padding-bottom: 2rpx;
          padding-top: 2rpx;
        }
      }

      .suggest-card-bottom-button {
        display: flex;
        align-items: center;

        .consultant_entrance_hot_white {
          width: 44rpx;
          height: 44rpx;
          margin-right: 12rpx;
        }
      }
    }

    &-bottom {
      position: relative;
      display: flex;
      justify-content: space-between;
      flex-direction: column;
      padding: 16rpx 32rpx;
      background-color: white;
      border-radius: 0 0 12rpx 12rpx;
      height: 76rpx;
      overflow: hidden;

      &-container {
        position: relative;
        top: 0;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
      }

      &-item {
        display: flex;
        justify-content: space-between;
        margin-bottom: 16rpx;
      }

      &-title {
        display: flex;
        align-items: center;
        // font-weight: bold;
        font-size: 26rpx;

        &-num {
          font-family: PingFang-SC, PingFang-SC;
          font-weight: bold;
          font-size: 28rpx;
          color: #f75a3e;
          line-height: 40rpx;
          text-align: left;
          font-style: normal;
        }
      }

      &-button {
        background: #f75a3e;
        border-radius: 28rpx;
        padding: 10rpx 32rpx;
        font-size: 24rpx;
        color: white;
        font-weight: bold;
      }
    }
  }

  .top-card {
    margin: 70rpx 32rpx 0 32rpx;
    border-radius: 10rpx;
    border-bottom: 2rpx solid #f4f4f4;
    padding-bottom: 44rpx;

    &-basic {
      display: flex;
      justify-content: space-between;
      margin-top: 24rpx;

      .info {
        display: flex;
        align-items: center;

        .name {
          margin-right: 16rpx;
          font-size: 48rpx;
          // font-size: $uni-font-size-max;
          font-weight: bold;
          color: $uni-text-color-222;
          letter-spacing: 2rpx;
        }

        .edit {
          font-size: 28rpx;
          // color: #ff4928;
          // background-color: #f5f5f5;
          // padding: 8rpx 28rpx;
          display: inline-block;
          border-radius: 20rpx;

          background-image: url($img-base-resume + "edit_new.png?v=2");
          background-size: 100% 100%;
          background-repeat: no-repeat;
          width: 36rpx;
          height: 36rpx;
        }
      }

      .avatar-wrap {
        display: inline-block;
        padding: 4rpx;
        border-radius: 50%;
        background: #fff;
      }

      .avatar {
        width: 108rpx;
        height: 108rpx;
        border-radius: 50%;
        // border: 1px solid #cccccc;
      }

      .tag-list {
        font-size: 26rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #333333;
        line-height: 36rpx;
      }

      .status {
        font-size: 24rpx;
        color: $uni-text-color-999;
      }

      .divider {
        display: inline-flex;
        align-items: center;
        height: 24rpx;
        margin: 0 12rpx;
      }
    }

    .concat-bar {
      display: flex;
      align-items: center;

      &-item {
        display: flex;
        align-items: center;
        font-size: 24rpx;
        margin-right: 28rpx;
      }
    }
  }

  .jd-consultant {
    position: fixed;
    display: flex;
    top: 121rpx;
    align-items: center;
    justify-content: space-between;
    width: calc(100vw - 64rpx);
    margin: 0 32rpx;
    padding: 16rpx !important;
    background-color: white;
    border-radius: 10rpx;
    box-shadow: 0rpx 4rpx 34rpx 4rpx rgba(51, 110, 214, 0.08);
    z-index: 999;

    &.isIOS {
      top: 167rpx;
    }

    &-container {
      display: flex;
      align-items: center;

      .market-icon {
        width: 54rpx;
        height: 54rpx;
        margin-right: 14rpx;

        img {
          width: 54rpx;
          height: 54rpx;
        }
      }

      .market-main-text {
        margin-right: 26rpx;
        font-family: PingFang-SC, PingFang-SC;
        font-weight: bold;
        font-size: 30rpx;
        color: #333333;
        line-height: 36rpx;
        text-align: left;
        font-style: normal;
      }

      .market-sub-text {
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #666666;
        line-height: 32rpx;
        text-align: left;
        font-style: normal;
      }
    }

    .market-button {
      padding: 8rpx 28rpx;
      color: white;
      background: #f75a3e;
      font-size: 24rpx;
      border-radius: 28rpx;
      border: 3rpx solid #ffffff;
      font-weight: bold;
    }
  }

  .fill {
    padding: 0;
    border-radius: 10rpx;

    &-item {
      padding: 48rpx 32rpx 46rpx 32rpx;

      // border-bottom: 16rpx solid $uni-bg-color-grey;
      .title-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;

        .title-wrap {
          display: flex;
          align-items: center;
        }

        .title {
          display: flex;
          font-size: 36rpx;
          font-weight: bold;
          color: #000000;

          .title-content {
            max-width: 300rpx;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
          }
        }

        .required {
          margin-left: 16rpx;
          padding: 0rpx 2rpx;
          color: $uni-text-color-error;
          border: 1px solid $uni-border-color-red;
          border-radius: 8rpx;
          font-size: $uni-font-size-sm;
          line-height: $uni-font-size-nor;
        }

        .add {
          display: flex;
          align-items: center;
          color: $u-type-primary;
          font-size: $uni-font-size-sm;

          &-icon {
            display: inline-block;
            vertical-align: middle;
            width: 36rpx;
            height: 36rpx;
            // margin-right: 8rpx;
            background-image: url($img-base-resume + "add_new.png?v=2");
            background-size: 100% 100%;
          }
        }
      }

      .info-list {
        margin-top: 32rpx;

        .info-item {
          padding-bottom: 32rpx;

          &:last-of-type {
            padding-bottom: 0rpx;
          }

          .name-bar {
            display: flex;
            align-items: center;
            justify-content: space-between;

            .name-wrap {
              display: flex;
              align-items: center;
              width: 100%;

              .subtitle {
                margin-left: 20rpx;
              }
            }

            .title {
              display: flex;
              font-weight: bold;
              font-size: 30rpx;
              color: $uni-text-color-333;
              overflow: hidden;
              flex: 1;
              white-space: nowrap;
              text-overflow: ellipsis;

              .title-content {
                max-width: 300rpx;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
              }
            }

            .name-icon {
              margin-right: 12rpx;
              width: 36rpx;
              height: 36rpx;
              background-size: 100% 100%;

              &-enterprise {
                background-image: url($img-base-resume + "enterprise.png?v=1");
              }

              &-school {
                background-image: url($img-base-resume + "school.png?v=1");
              }

              &-project {
                background-image: url($img-base-resume + "project.png?v=1");
              }

              &-skill {
                background-image: url($img-base-resume + "skill.png");
              }
            }
          }

          .time {
            display: flex;
            align-items: center;
            margin-top: 16rpx;
            font-size: 26rpx;
            color: #888888;

            .detail-title {
              display: flex;
              margin-left: 44rpx;
              color: #888888;
              font-size: 26rpx;

              .isPractice {
                margin-left: 32rpx;
                padding: 1rpx 18rpx;
                border-radius: 6rpx;
                border: 2rpx solid #32bb4b;
                font-size: 22rpx;
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                color: #32bb4b;
                line-height: 32rpx;
              }
            }
          }
        }
      }

      .info-empty {
        padding: 16rpx 0;
        text-align: center;
        color: $uni-text-color-555;
        font-size: $uni-font-size-nor;
      }

      .info {
        margin-top: 24rpx;
        padding-bottom: 32rpx;

        &:last-of-type {
          padding-bottom: 0rpx;
        }
      }

      .edit-icon {
        width: 24rpx;
        height: 24rpx;
        margin-right: 8rpx;
        background-image: url($img-base + "career/right-arrow.png?v=1");
        background-size: 100% 100%;
      }

      .detail {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        /* 设置显示三行文本 */
        -webkit-line-clamp: 3;
        /* 设置行高，以避免文本显示不全 */
        line-height: 1.5rem;
        /* 根据实际情况调整行高 */
        margin-top: 20rpx;
        color: $uni-text-color-999;
        font-size: $uni-font-size-sm;
        line-height: 48rpx;
        word-break: break-all;
        max-height: 294rpx;
        overflow: hidden;
        text-overflow: ellipsis;

        &.bold {
          font-size: 30rpx;
          font-family: PingFang-SC, PingFang-SC;
          font-weight: bold;
          color: #333333;
          line-height: 42rpx;
        }

        &-title {
          color: $uni-text-color-333;
          text-shadow: 0 0 0;
          line-height: normal;

          .zye {
            margin-left: 16rpx;
          }
        }

        &-desc {
          // margin-top: 24rpx;
          line-height: 38rpx;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          font-size: 26rpx;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;

          .sub-desc {
            margin-left: 44rpx;
          }
        }
      }
    }

    &-item.button-style {
      .info-list {
        display: flex;
        flex-wrap: wrap;

        .info-item {
          .name-bar {
            padding: 28rpx 32rpx;
            background: #f5f6f7;
            border-radius: 16rpx;
            margin-right: 20rpx;

            .title {
              font-size: 28rpx;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              color: #333333;
              line-height: 40rpx;
            }
          }
        }
      }
    }
  }

  .extra {
    padding: 62rpx 32rpx 36rpx;

    &-title {
      font-size: 40rpx;
      font-family: PingFang-SC, PingFang-SC;
      font-weight: 800;
      color: #000000;
      line-height: 56rpx;
      margin-bottom: 36rpx;
    }

    &-list {
      display: grid;
      grid-row-gap: 16rpx;
      grid-column-gap: 16rpx;
      grid-template-columns: repeat(2, 1fr);

      &-item {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        padding: 36rpx 32rpx;
        background: #f5f6f7;
        font-size: 32rpx;
        color: #333333;
        border-radius: 16rpx;

        &.concern {
          ::after {
            content: "招聘者更关心";
            position: absolute;
            top: 0;
            right: 0;
            padding: 0rpx 14rpx;
            background: #f75a3e;
            border-radius: 0rpx 16rpx 0rpx 11rpx;
            font-size: 22rpx;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            color: #ffffff;
            line-height: 32rpx;
            letter-spacing: 2rpx;
          }
        }

        .add-icon {
          display: inline-block;
          vertical-align: middle;
          width: 36rpx;
          height: 36rpx;
          margin-right: 24rpx;
          background-image: url($img-base-resume + "add_new.png?v=1");
          background-size: 100% 100%;
        }
      }
    }
  }

  .update {
    padding: 40rpx 0 56rpx 0;
    text-align: center;
    color: #b3b3b3;
    font-size: $uni-font-size-sm;
  }

  .produce-btns {
    z-index: 2;
    width: calc(100vw - 64rpx);
    height: 120rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 32rpx;
    position: fixed;
    bottom: 82rpx;
    padding-bottom: calc(2rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(2rpx + env(safe-area-inset-bottom));
    box-shadow: 0rpx 4rpx 46rpx 4rpx rgba(107, 136, 187, 0.2);
    border-radius: 24rpx;
    background: #ffffff;
    padding: 0 46rpx;

    .produce-btn-item {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      font-size: 24rpx;
      color: #333333;

      .k-icon {
        display: block;
        margin: 0 auto;
        margin-bottom: 6rpx;
        width: 48rpx;
        height: 48rpx;
        background-size: 100% 100%;
        background-color: #fff;
      }
    }

    .btn {
      width: 100%;
    }
  }

  .diffirentBottom {
    padding: 0 40rpx;

    .real-btns {
      flex: 1;
      display: flex;
      justify-content: space-between;
      padding-right: 22rpx;
    }

    .consultant-buy-entrance {
      flex: 1;
      display: flex;
      justify-content: center;
      font-family: PingFang-SC, PingFang-SC;
      font-weight: bold;
      font-size: 32rpx;
      color: #333333;
      line-height: 44rpx;
      text-align: left;
      font-style: normal;

      img {
        width: 58rpx;
        height: 48rpx;
        margin-right: 18rpx;
      }
    }

    .toggleBtn {
      padding-left: 26rpx;
      border-left: 2rpx solid #f4f4f4;

      .newResumeBottonToggle {
        width: 58rpx;
        height: 54rpx;
      }
    }
  }
}
</style>
